<template>
<view class="publish">
	<view class="describe">
		<view class="describes">
			<input type="text" :value="content" @input="inputIntro" ref="intro" placeholder="房屋描述" />
		</view>
		<view class="tip">
			详细描述会为你带来最快速的成交哦： 
			1、描述一下你房源的优势，如距距离地铁近2、描述下房源内部结构，如老小区，新新装修3、描述下你希望什么样的房客，如爱护房子的小两口
		</view>
	</view>	
		
		
		<view class="burst-wrap">
        <view class="burst-wrap-bg">
            <view>
                <!-- 信息提交 -->
                <view class="burst-info">
                    <view class="uni-uploader-body">
                        <view class="uni-uploader__files">
							
                            <!-- 图片 -->
                           <block v-for="(image,index) in imageList" :key="index">
                                <view class="uni-uploader__file comm">
                                    <view class="icon iconfont icon-cuo" @tap="delect(index)"></view>
                                    <image class="uni-uploader__img" :src="image" :data-src="image" @tap="previewImage"></image>
                                </view>
                            </block>
							
                            <!-- 视频 -->
                            <view class="uni-uploader__file comm" v-if="src">
                                <view class="uploader_video">
                                    <view class="icon iconfont icon-cuo" @tap="delectVideo"></view>
                                    <video :src="src" class="video"></video>
                                </view>
                            </view>
							
							
                            <view class="uni-uploader__input-box comm" v-if="VideoOfImagesShow">
                                <view class="uni-uploader__input" @tap="chooseVideoImage">图片/视频</view>
                            </view>
							
							
                        </view>
                    </view>


                </view>
            </view>
        </view>
    </view>
	
	<view class="publishForm">
		<view class="publishList">
			
			<view class="publishItem">
				<view class="left">
					标题
				</view>
				<view class="right">
					<input type="text" ref="title" :value="title" @input="inputTitle" placeholder="请输入标题" />
				</view>
			</view>
			
			
			<view class="publishItem">
				<view class="left">
					房屋户型
				</view>
				<view class="right">
					 
					<picker class="int pick" mode="selector" :range="houseLayout" @change="selectType">
						<view>{{houseLayout[curLayout]}}</view>
					</picker>
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>
				</view>
			</view>
			
			
			<view class="publishItem">
				<view class="left">
				   所属区域
				</view>
				<view class="right">
					 
					<picker class="int pick" mode="selector" :range="houseArea" @change="selectArea">
						<view>{{houseArea[curArea]}}</view>
					</picker>
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>
				</view>
			</view>
			
			<view class="publishItem">
				<view class="left">
					配置
				</view>
				<view class="right">	
					<view class="int pick" @click="configClick">					
						<ul>					
							<li v-for="(item,index) in configs">{{item}}.</li>
						</ul>
					</view>				
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>
				</view>
			</view>
			
			
			<view class="publishItem">
				<view class="left">
					朝向
				</view>
				<view class="right">
					<picker class="int pick" mode="selector" :range="houseOrientations" @change="selectOrientations">
						<view>{{houseOrientations[curOrientations]}}</view>
					</picker>
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					面积
				</view>
				<view class="right">
					<input type="text" ref="house_area" @input="inputHouseArea" :value="house_area" placeholder="请输入房源面积" />
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					楼层
				</view>
				<view class="right">
					<input type="text" ref="house_floor" @input="inputHouseFloor" :value="house_floor"  placeholder="请输入楼层" />
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					租金
				</view>
				<view class="right">
					<input type="text" ref="price" @input="inputPrice" :value="price" placeholder="请输入月租金" />
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					房屋位置
				</view>
				<view class="right">
					<input type="text" ref="location_near" @input="inputLocationNear" :value="location_near" placeholder="例：XX区XX街xx号/距离3号线4m" />
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					地图位置
				</view>
				<view class="right">
					<view class="pick mapsite"  @click="chooseLocation">{{locationAddress}}</view>
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					标签
				</view>
				
				<view class="right">									
					<view class="int pick" @click="tagsClick">
						<ul>					
							<li v-for="(item,index) in tags">{{item}}.</li>
						</ul>
					</view>	
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>				
				</view>
			</view>
			<view class="publishItem">
				<view class="left">
					房屋业主
				</view>
				
				<view class="right">							
					<input class="int pick" type="text" :value=agentname placeholder="请输入业主" @click="aa"/>					
					<image src="../../../static/icon/arrow.png" class="rightArrow" mode=""></image>						
				</view>								
			</view>
		</view>
		<view class="bottom">
			<view class="box">
				<view class="text">
					是否推荐
				</view>
				<switch color="#FF984C" @change="switchChange" class="switch" />
			</view>
			
		</view>
	
		<s-popup custom-class="demo-popup" position="bottom" v-model="visible">
		  <view class="visit-nav">			 			
			  <view class="submit" @click="submit">确认</view>		 		  
		  </view>
		 
		  <view class="uni-list">
		              <checkbox-group @change="checkboxChange">
		                  <label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in items" :key="item.value">
		                      <view class="com">
		                          <checkbox :value="item.value" :checked="item.checked" />
		                      </view>
		                      <view class="com">{{item.name}}</view>
		                  </label>
		              </checkbox-group>
		 </view>		  	  		  
		</s-popup>
		
		<s-popup custom-class="demo-popup" position="bottom" v-model="visible2">
		  <view class="visit-nav">			 			
			  <view class="submit" @click="submit2">确认</view>		 		  
		  </view>
				
		  <view class="uni-list">
				     <checkbox-group @change="checkboxChange2">
		                  <label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in items2" :key="item.value">
		                      <view class="com">
		                          <checkbox :value="item.value" :checked="item.checked" />
		                      </view>
		                      <view class="com">{{item.name}}</view>
		                  </label>
		              </checkbox-group>
		 </view>			  		  
		</s-popup>			
	</view>
	
	<mpopup  ref="mpopup" :isdistance="true"></mpopup>  
</view>
</template>

<script>
	var _self
	import mpopup from '@/components/xuan-popup/xuan-popup.vue';
	import sPopup from '@/components/s-popup/index.vue'
	var util = require('../../../common/util.js');
	var formatLocation = util.formatLocation;
	var sourceType = [
	        ['camera'],
	        ['album'],
	        ['camera', 'album']
	    ]
	export default{
		components:{sPopup,mpopup},
		data(){
			return{
				location: {},
				lon:0,
				lat:0,
				locationAddress: '',	
				title:'',
				content:'',
				price:'',
				location_near:'',
				house_floor:'',
				house_area:'',				
				visible:false,
				visible2:false,
				agent_id:0,
				agentname:'',
				houseLayout:['选择'],
				curLayout:0,
				houseLayoutFromApi:[],
				curLayoutFromApi:0,
		 
				houseConfig:['选择'],
				curConfig:0,
				houseConfigFromApi:[],
				curConfigFromApi:0,
				
				housePosition:['位置'],
				curPosition:0,
				houseMap:['空调','wifi','冰箱'],
				curMap:0,
								
				houseTags:['选择'],
				curTags:0,
				houseTagsFromApi:[],
				curTagsFromApi:0,
								
				houseArea:['选择'],
				curArea:0,
				houseAreaFromApi:[],
				curAreaFromApi:0,
										
				switchValue:false,				
				houseOrientations:['选择'],
				curOrientations:0,
				houseOrientationsFromApi:[],
				curOrientationsFromApi:0,
	
				imageList:[],//图片
				imageListServer:[],
				    src:"",//视频存放
				    sourceTypeIndex: 2,
				    checkedValue:true,
				    checkedIndex:0,
				    sourceType: ['拍摄', '相册', '拍摄或相册'],
				    cameraList: [{
				            value: 'back',
				            name: '后置摄像头',
				            checked: 'true'
				        },
				        {
				            value: 'front',
				            name: '前置摄像头'
				        },
				    ],
				    cameraIndex: 0,
				    VideoOfImagesShow:true,
									
					configs:[],
					tags:[],
					
					items: [],
					items2:[],
										
					houseId:0					
				}								
			},
		
		onLoad() {
			_self = this
			this.checkLogin()
		    this.src = '',
		    this.sourceTypeIndex = 2,
		    this.sourceType = ['拍摄', '相册', '拍摄或相册']		
			//监听
			this.$eventHub.$on('fire', function (data) {				
				if(data[0]){
					_self.agent_id = data[0]
					_self.agentname = data[1]					
				}
			});
			//获取房源属性
			this.gethouseAttribute()							
		},
		onShow(){
			this.houseId = uni.getStorageSync('houseId')						
			console.log(this.houseId)
			if(this.houseId){
				this.houseDetail(this.houseId)
			}
									
		},
		methods:{
			houseDetail($houseId){
				uni.request({
					url: this.websiteUrl+'/api.php/house/houseDetailEdit',
					method: 'POST',
					data: {house_id:$houseId},
					header: {
						'content-type':'application/x-www-form-urlencoded'				  
					},
					success:function(res){
						if(res.data.code == 1){
							//_self.title = res.data.data.title
							//_self.content = res.data.data.content
							//_self.src = '/uploads/20200216/34dbe901cddd26c1b7a553963f3f86d2.mp4'
							
						}
						
					}
				});	
			},
			 submit(){
				 this.visible = false				 
			 },
			 submit2(){
				 this.visible2 = false				 
			 },
			 chooseLocation: function () {
			 	uni.chooseLocation({
			 		success: (res) => {
			 			this.hasLocation = true,						
			 			this.location = formatLocation(res.longitude, res.latitude),												
						_self.lon = res.longitude
						_self.lat = res.latitude						
			 			this.locationAddress = res.address											
			 		}
			 	})
			 }, 	 
			 checkboxChange: function (e) {				
			                var items = this.items,
			                    values = e.detail.value;
			                for (var i = 0, lenI = items.length; i < lenI; ++i) {
			                    const item = items[i]
			                    if(values.includes(item.value)){
			                        this.$set(item,'checked',true)
			                    }else{
			                        this.$set(item,'checked',false)
			                    }
			                }
							this.configs = e.detail.value
		    },
			checkboxChange2: function (e) {				
			                var items2 = this.items2,
			                    values = e.detail.value;
			                for (var i = 0, lenI = items2.length; i < lenI; ++i) {
			                    const item2 = items2[i]
			                    if(values.includes(item2.value)){
			                        this.$set(item2,'checked',true)
			                    }else{
			                        this.$set(item2,'checked',false)
			                    }
			                }
							this.tags = e.detail.value
			},
			
			configClick(){
				_self.visible = true
			},
			tagsClick(){
				_self.visible2 = true
			},
			aa() {uni.navigateTo({
					url: '../../me/content/connection?action=publish'
				});
				
			},
			gethouseAttribute(){
				uni.request({
					url: this.websiteUrl+'/api.php/house/houseAttribute',
					method: 'GET',
					data: {},
					success: function(res){
					
					
						if(res.data.code == 1){	
							
							
							var list_layout = res.data.data.list_layout														
							for(var k in list_layout){
								_self.houseLayout.push(list_layout[k])
							}						
							_self.houseLayoutFromApi = list_layout
							
							var list_area = res.data.data.list_area
							for(var k in list_area){
								_self.houseArea.push(list_area[k])
							}
							_self.houseAreaFromApi = list_area
							
							
							var list_orientations = res.data.data.list_orientations
							for(var k in list_orientations){
								_self.houseOrientations.push(list_orientations[k])
							}
							_self.houseOrientationsFromApi = list_orientations
							
							_self.items = res.data.data.list_config
							_self.items2 = res.data.data.list_tags
 							
						}
					},
					
				});
			},
			
			chooseVideoImage(){
			    uni.showActionSheet({
			        title:"选择上传类型",
			        itemList: ['图片','视频'],
			        success: (res) => {
			            console.log(res)
			            if(res.tapIndex == 0){
			                this.chooseImages()
			            } else {
			                this.chooseVideo()
			            }
			        }
			    })
			},
			chooseImages(){
			    // 上传图片
			    uni.chooseImage({
			        count: 4, //默认9
			        sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
			        sourceType: ['album','camera'], //从相册选择
			        success:(res)=> {
						 const tempFilePaths = res.tempFilePaths
			            this.imageList = this.imageList.concat(res.tempFilePaths);
			            
			            if(this.imageList.length == 4) {
			                this.VideoOfImagesShow = false
			            }
						uni.uploadFile({																	   
								url: 'http://api.yjzufang.com/api.php/center/upload', //仅为示例，非真实的接口地址							 
								filePath:tempFilePaths[0],
								name:'file',
								success: function(res2){									
									 var re = JSON.parse(res2.data);										
									if(re.code ==1){									
										_self.imageListServer.push(re.data)										
									}
								}
						})						
			        }
			    });
			},
			chooseVideo(){
			    // 上传视频
			    console.log('上传视频')
			    uni.chooseVideo({
			        maxDuration:10,
			        count: 1,
			        camera: this.cameraList[this.cameraIndex].value,
			        sourceType: sourceType[this.sourceTypeIndex],
			        success: (res) => {
			           // console.log(JSON.stringify(res.tempFilePath),'视频')
			            this.src = res.tempFilePath;
						uni.uploadFile({
								url: 'http://api.yjzufang.com/api.php/center/upload', //仅为示例，非真实的接口地址							 
								filePath:res.tempFilePath,
								name:'file',
								success: function(res2){									
									 var re = JSON.parse(res2.data);										
									if(re.code ==1){									
										_self.src = re.data
									}
								}
						})										        
			        }
			    })
			},
			previewImage: function(e) {
			    //预览图片
			    var current = e.target.dataset.src
			    uni.previewImage({
			        current: current,
			        urls: this.imageList
			    })
			},
			delect(index){
			    uni.showModal({
			        title: "提示",
			        content: "是否要删除该图片",
			        success: (res) => {
			            if (res.confirm) {
			                this.imageList.splice(index, 1)
			            }
			        }
			    })
			},
			delectVideo(){
			    uni.showModal({
			        title:"提示",
			        content:"是否要删除此视频",
			        success:(res) =>{
			            if(res.confirm){
			                this.src = ''
			            }
			        }
			    })
			},			
			selectType(e){
				this.curLayout =e.detail.value
				var sedIndex= e.detail.value;	
									console.log(this.curLayout)
				if(sedIndex < 1){return ;}
				var layoutName = this.houseLayout[sedIndex];			
				for(var k in this.houseLayoutFromApi){
				     if(layoutName == this.houseLayoutFromApi[k]){
				        this.curLayoutFromApi = k;
				        break;
				     }					 
			    }														
			},
			selectConfig(e){
				this.curConfig =e.detail.value				
				var sedIndex2 = e.detail.value
				if(sedIndex2 < 1){return ;}
				var configName = this.houseConfig[sedIndex2]
				for(var k2 in this.houseConfigFromApi){
					if(configName == this.houseConfigFromApi[k2]){
						this.curConfigFromApi = k2;
						break;
					}				
				}				
			},	
			selectArea(e){
				this.curArea = e.detail.value
				var sedIndex = e.detail.value
				if(sedIndex < 1){return;}
				var areaName = this.houseArea[sedIndex]
				for(var k in this.houseAreaFromApi){
					if(areaName == this.houseAreaFromApi[k]){
						this.curAreaFromApi = k
						break;
					}
				}
			},		
				
			selectPosition(e){
				this.curPosition =e.detail.value
			},
			selectMap(e){
				this.curMap =e.detail.value
			},
			
			selectOrientations(e){
				this.curOrientations = e.detail.value
				var sedIndex = e.detail.value
				if(sedIndex < 1){return;}
				var orientationsName = this.houseOrientations[sedIndex]
				for(var k in this.houseOrientationsFromApi){
					if(orientationsName == this.houseOrientationsFromApi[k]){
						this.curOrientationsFromApi = k
						break;
					}
				}
					
			},		
			selectTag(e){
				this.curTags =e.detail.value
				var sedIndex3 = e.detail.value
				if(sedIndex3 < 1){
					return;
				}
				var tagsName = this.houseTags[sedIndex3]
				for(var k3 in this.houseTagsFromApi){
					if(tagsName == this.houseTagsFromApi[k3]){
						this.curTagsFromApi = k3
						break;
					}
				}				
			},
			switchChange(e){				
				_self.switchValue = e.detail.value
			},			
			onNavigationBarButtonTap(e) {
				if(e.type == 'publish'){
					this.getpublish()
				}
			},
			inputTitle(e){
				this.title = e.detail.value
			},
			inputIntro(e){
				this.content = e.detail.value
			},
			inputPrice(e){
				this.price = e.detail.value
			},
			inputLocationNear(e){
				this.location_near = e.detail.value
			},
			inputHouseFloor(e){
				this.house_floor = e.detail.value
			},
			inputHouseArea(e){
				this.house_area = e.detail.value
			},
			
	
			getpublish(){
				let title = this.title
				let price = this.price
				let location_near = this.location_near
				let house_floor = this.house_floor
				let house_area = this.house_area
				let content = this.content								
				
				if(!title){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入标题",
						timeout:2000,
					});
					return false;
				}
				
				if(!content){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入描述",
						timeout:2000,
					});
					return false;
				}
				if(!this.imageListServer){
					this.$refs.mpopup.open({
						type:'info',
						content:"请上传房源图片",
						timeout:2000,
					});
					return false;
				}
				if(!this.curLayoutFromApi){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择户型",
						timeout:2000,
					});
					return false;
				}
				if(!this.curAreaFromApi){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择房源所属区域",
						timeout:2000,
					});
					return false;
				}
				if(!this.configs){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择配置",
						timeout:2000,
					});
					return false;
				}
				if(!this.curOrientationsFromApi){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择朝向",
						timeout:2000,
					});
					return false;
				}
				if(!house_area){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入面积",
						timeout:2000,
					});
					return false;
				}
				if(!house_floor){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入楼层",
						timeout:2000,
					});
					return false;
				}
				if(!price){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入租金",
						timeout:2000,
					});
					return false;
				}
				if(!location_near){
					this.$refs.mpopup.open({
						type:'info',
						content:"请输入房屋位置",
						timeout:2000,
					});
					return false;
				}
				if(!this.locationAddress){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择地图位置",
						timeout:2000,
					});
					return false;
				}
				
				
				if(!this.tags){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择房源标签",
						timeout:2000,
					});
					return false;
				}								
				if(!this.agent_id){
					this.$refs.mpopup.open({
						type:'info',
						content:"请选择房屋业主",
						timeout:2000,
					});
					return false;
				}	
										
				//let lon = parseFloat(this.location.longitude[0])+parseFloat(this.location.longitude[1]/60)
				//let lat = parseFloat(this.location.latitude[0])+parseFloat(this.location.latitude[1]/60)						
										
										
				uni.request({					
					url: this.websiteUrl+'/api.php/house/housePublish',
					method: 'POST',
					header: {
						'content-type':'application/x-www-form-urlencoded'					
					},
					data: {
						token:uni.getStorageSync('token'),
						title:title,
						content:content,
						location_near:location_near,
						price:price,
						house_area:house_area,
						house_orientations:this.curOrientationsFromApi,
						house_floor:house_floor,
						house_config:this.configs,
						house_tags:this.tags,
						area_id:this.curAreaFromApi,
						house_layout:this.curLayoutFromApi,
						lon: _self.lon,
						lat: _self.lat,
						location_address:this.locationAddress,
						landlord_id:this.agent_id,
						is_recommend:this.switchValue,
						video:this.src,
						images:this.imageListServer
					},
					success: function(res){
						if(res.data.code == 1){
							
							uni.navigateTo({
							    url: '../../me/content/houseDetail?house_id='+res.data.data
							});														
						}else{
							this.$refs.mpopup.open({
								type:'error',
								content:"编辑失败",
								timeout:2000,
							});
							
						}																		
					},					
				});
			}			
		}
	}
</script>

<style>
	.pick ul{padding:0;height: 100%;overflow: hidden;}
	ul li{list-style: none;float:left;padding-right:5rpx}
	.uni-uploader__input-box{
		width:160rpx;
		height: 160rpx;		
	    background:#F2F6F9;
		color:#AAAAAA;
		font-size:16rpx;
		line-height: 160rpx;
		text-align:center
	}
	.com{float:left}
	.mapsite{overflow: hidden;}
	.comm{
		float:left;
	}
	.burst-wrap{
		
	    width: 100%;
	    height:100%;
		
	}
	 .burst-wrap .burst-wrap-bg{
	    position: relative;
	    width: 100%;
	    height: 320upx;
	  
	    border-bottom-right-radius: 80upx;
	    border-bottom-left-radius: 80upx;
	} 
	.burst-wrap .burst-wrap-bg>view{
	    width: 90%;
	    height: 100%;
	    margin: 0 auto;
	    position: absolute;
	    top: 65upx;
	    left: 0;
	    right: 0;
	}
	
	.form-item{
	    width: 100%;
	}
	.form-item textarea{
	    display: block;
	    height: 220upx;
	    width: 100%;
	    color: #AAAAAA;
	    font-size: 28upx;
	}
	.uni-uploader__file,.uploader_video{
	    position: relative;
	    z-index: 1;
	    width: 200upx;
	    height: 200upx;
	}
	.uni-uploader__img {
	    width: 200upx;
	    height: 200upx;
	}
	.icon-cuo {
	    position: absolute;
	    right: 0;
	    top: 5upx;
	    background: linear-gradient(90deg,rgba(251,91,80,1) 0%,rgba(240,45,51,1) 100%);
	    color: #FFFFFF;
	    z-index: 999;
	    border-top-right-radius: 20upx;
	    border-bottom-left-radius: 20upx;
	}
	.video{
	    width: 100%;
	    height: 100%;
	}
	
	.login-input-box{
	    position: relative;
	    border-bottom: 1upx solid #EEEEEE;
	}
	.login-input-box .forget,.login-input-box .phone{
	    position: absolute;
	    top: 0;
	    height: 100%;
	    z-index: 100;
	}
	.login-input-box .phone{
	    width: 100upx;
	    left: 0;
	    color: #666666;
	    font-weight: bold;
	}
	.login-input-box .phone-input{
	    padding-left: 100upx;
	}
	.address-wrap,.open-info{
	    margin-top: 20upx;
	}
	.open-info>view:last-child{
	    font-size: 28upx;
	    color: #999999;
	}
	.address-wrap .address {
	    background: #F2F2F2;
	    border-radius: 40upx;
	    padding: 0 20upx;
	}
	.user-set-btn{
	    margin: 40upx;
	    background: linear-gradient(90deg,rgba(251,91,80,1) 0%,rgba(240,45,51,1) 100%);
	    color: #FFFFFF;
	    text-align: center;
	    height: 88upx;
	    line-height: 88upx;
	}
	
	
	.publish{
		overflow: hidden;
		background: #FFFFFF;
		position:relative
	}
	.describe{
		width: 90%;
		margin: 0 auto;
		
	}	
	.describes{
		padding: 40upx 0;
		border-bottom: solid 1px #EEEEEE;
	}
	.describes input{
		color: #AAAAAA;
		font-size: 30upx;
		line-height: 50upx;
	}
	.tip{
		margin: 40upx auto;
		color: #AAAAAA;
		font-size: 28upx;
		line-height: 40upx;
	}
	.picture{
		margin-top: 100upx;
		
	}
	.uploadPic{
		display: flex;
	}
	.uploadButton{
		width: 160upx;
		height: 160upx;
		background: #F2F6F9;
	}
	.uploadButton .add{
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 40upx auto 10upx;
		width: 50upx;
		height: 50upx;
		border: solid 1px #CCCCCC;
	}
	.uploadButton .add image{
		width: 20upx;
		height: 20upx;
	}
	.uploadButton .text{
		color: #AAAAAA;
		font-size: 18upx;
		text-align: center;
	}
	.publishForm{
		overflow: hidden;
		margin-top: 40upx;
		background: #FFFFFF;
	}
	.publishList{
		width: 700upx;
		margin: 0 auto;
	}
	.publishItem{
		display: flex;
		width: 100%;
		height: 130upx;
		border-bottom: solid 1px #EEEEEE;
	}
	.publishItem .left{
		width: 180upx;
		color: #373737;
		font-size: 30upx;
		line-height: 130upx;
		font-weight: bold;
	}
	.publishItem .right{
		display: flex;
		width: 520upx;
		font-size: 30upx;
		line-height: 130upx;
	}
	.publishItem .right .pick{
		width: 450upx;
	}
	.publishItem .rightArrow{
		margin-top: 50upx;
		width: 13upx;
		height: 26upx;
	}
	.publishItem .right input{
		height: 130upx;
	}
	.bottom{
		overflow: hidden;
		width: 100%;
		margin: 40upx auto 80upx;
		background: #FFFFFF;
	}
	.bottom .box{
		display: flex;
		justify-content: space-between;
		width: 700upx;
		margin: 0 auto;
	}
	.bottom .text{
		color: #373737;
		font-size: 30upx;
		line-height: 130upx;
		font-weight: bold;
	}
	.bottom .switch{
		margin-top: 30upx;
	}
	
	.uni-nav{
		width:100%;
		height:88rpx;
		position:relative
	}
	
	.submit{
		position:absolute;
		font-size:34rpx;
		color:#FF984C;
		line-height: 88rpx;
		right:40rpx;
		
	}
	
	.uni-list{
		width:100%;
		margin-top:88rpx;
	}
	
	.uni-list-cell {
		float:left;
	}
	
	
	
</style>
